<section class="page project-manage-page">
  <div class="title row between-span middle-span">
    项目管理
    <button nz-button [nzType]="'primary'" nzSize="small">
      <span routerLink="/report-manage">返回</span>
    </button>
  </div>
  <div class="command">
    <a (click)="showProjectDialog(projectDetail)">新建项目</a>
  </div>
  <div nz-row [nzGutter]="16">
    <div nz-col [nzMd]="24">
      <nz-card>
        <ng-template #body>
          <nz-table #nzTable [nzAjaxData]="dataSet" [nzShowSizeChanger]="true" [nzLoading]="page.loading" [nzTotal]="page.total" [(nzPageIndex)]="page.pageIndex"
            (nzPageIndexChange)="refreshData()" [(nzPageSize)]="page.pageSize" (nzPageSizeChange)="refreshData()">
            <thead nz-thead>
              <tr>
                <th nz-th>
                  <span>项目名称</span>
                </th>
                <th nz-th>
                  <span>创建时间</span>
                </th>
                <th nz-th>
                  <span>操作</span>
                </th>
              </tr>
            </thead>
            <tbody nz-tbody>
              <tr nz-tbody-tr *ngFor="let data of nzTable.data">
                <td nz-td>{{data.name}}</td>
                <td nz-td>{{data.createAt | date:'yyyy-MM-dd mm:ss'}}</td>
                <td nz-td>
                  <a (click)="showProjectDialog(projectDetail,data)">更新</a>
                  <a (click)="deleteProject(data.id)">删除</a>
                </td>
              </tr>
            </tbody>
          </nz-table>
        </ng-template>
      </nz-card>
    </div>
  </div>
</section>

<!--认证弹出框-->
<ng-template #projectDetail>
  <form nz-form nzLayout="horizontal" [formGroup]="projectForm">
    <div nz-form-item nz-row>
      <div nz-form-label nz-col [nzSpan]="3">
        <label>项目名称</label>
      </div>
      <div nz-form-control nz-col [nzSpan]="10" [nzValidateStatus]="projectForm.controls.name">
        <nz-input formControlName="name" [nzPlaceHolder]="'项目名称'" [nzSize]="'large'">
        </nz-input>
        <div nz-form-explain *ngIf="projectForm.controls.name.dirty&&projectForm.controls.name.hasError('required')">
          请输入项目名称
        </div>
      </div>
    </div>
  </form>
</ng-template>
